<!doctype html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">

        <title>会议室管理系统</title>

        <link rel="shortcut icon" href="assets/media/favicons/favicon.png">
        <link rel="icon" type="image/png" sizes="192x192" href="assets/media/favicons/favicon-192x192.png">
        <link rel="apple-touch-icon" sizes="180x180" href="assets/media/favicons/apple-touch-icon-180x180.png">
        <!-- Fonts and OneUI framework -->
        <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400italic,600,700%7COpen+Sans:300,400,400italic,600,700">
        <link rel="stylesheet" id="css-main" href="assets/css/oneui.min.css">
    </head>
    <body>
        <div id="page-container">
            <!-- Main Container -->
            <main id="main-container">
                <!-- Page Content -->
                <div class="hero-static d-flex align-items-center">
                    <div class="w-100">
                        <!-- Sign In Section -->
                        <div class="content content-full bg-white">
                            <div class="row justify-content-center">
                                <div class="col-md-8 col-lg-6 col-xl-4 py-4">
                                    <!-- Header -->
                                    <div class="text-center">
                                        <h1 class="h4 mb-1">
                                            会议室管理系统 - MRMS
                                        </h1>
                                        <p class="mb-2">
                                            登录
                                        </p>
                                    </div>
                                    <!-- END Header -->

                                    <!-- Sign In Form -->
                                    <form class="loginForm">
                                        <div class="py-3">
                                            <div class="form-group">
                                                <input type="text" class="form-control form-control-lg form-control-alt" name="tel" placeholder="Tel">
                                            </div>
                                            <div class="form-group">
                                                <input type="password" class="form-control form-control-lg form-control-alt" name="password" placeholder="Password">
                                            </div>
                                        </div>
                                        <div class="form-group row justify-content-center mb-0">
                                            <div class="col-md-6 col-xl-5">
                                                <button class="btn btn-block btn-primary login">
                                                    <i class="fa fa-fw fa-sign-in-alt mr-1"></i> 登录
                                                </button>
                                            </div>
                                        </div>
                                    </form>
                                    <!-- END Sign In Form -->
                                </div>
                            </div>
                        </div>
                        <!-- END Sign In Section -->

                        <!-- Footer -->
                        <div class="font-size-sm text-center text-muted py-3">
                            <strong>MRMS 1.0</strong> &copy; <span data-toggle="year-copy"></span>
                        </div>
                        <!-- END Footer -->
                    </div>
                </div>
                <!-- END Page Content -->

            </main>
            <!-- END Main Container -->
        </div>
        <!-- END Page Container -->
        <script src="assets/js/oneui.core.min.js"></script>
        <script src="assets/js/oneui.app.min.js"></script>
        <script>

          $(".login").click(function(){
            $.get("http://localhost:3000/login?"+$(".loginForm").serialize()).then(res=>{
              if(res.code === 1){
                // 提示信息
                alert("登录成功");
                // 存储用户状态和信息
                sessionStorage.setItem("token", res.token);
                sessionStorage.setItem("userMsg", JSON.stringify(res.data));
                // 跳转首页
                location.assign("/index.html")
              }else{
                alert(res.msg);
              }
            })
            return false;
          })

        </script>
    </body>
</html>
